import React, {Component} from 'react';
import IceContainer from '@icedesign/container';
import DataBinder from '@icedesign/data-binder';
import { Table, Grid, Tab } from "@icedesign/base";
import BoardRiskTable from './components/BoardRiskTable'; // 举牌风险预警
import LineChart from './components/LineChart';// 两融警戒提示
import AbnormalTable from './components/AbnormalTable';// 市值异动提示
import FirstStockholder from './components/FirstStockholder'; // 第一股东股权质押风险提示
import './RiskWarning.scss';

const { Row, Col } = Grid;
const TabPane = Tab.TabPane;
const TitleBox = (props) => {
  return (
    <div className="title-box">
      <div className="tl supervise-title">
        <div className="kk"></div>
        {props.title}
        </div>
    </div>
  );
}
@DataBinder({
  company: {
    url: `${global.constants.GOLDEYEGETHOST}cattle/get_company_info`,
    type: 'get',
    params: {},
    defaultBindingData: {}
  },

})
export default class RiskWarning extends Component{
  constructor(props) {
    super(props);
    this.state = {
      // companyCode: '', // 证券代码
      // market: '', // 所属市场
      frameURL: '', // 分时url
    };
  }
  componentDidMount(){
    this.props.updateBindingData('company',{
      params: {
        secu_code:GetUrlParam("secu_code"),
      }
    }, (res) => {
      if(res.flag){
        this.setState({
          frameURL: "https://stockdata.cfbond.com/market_webapp/market/stockTrend.do?en_prod_code="+ res.data.secu_code + "." + res.data.market,
          // companyCode:res.data.secu_code,
          // market:res.data.market,
        })
      }
    });
  }
  render() {
    const {frameURL} = this.state;
    return (
      <div className="risk-warning-wrapper">
        <Row>
          <Col span="8" style={{paddingRight: '16px'}}>
            <IceContainer style={{ marginBottom: '15px', borderRadius: '0', padding: '0' }}>
              <TitleBox title="两融警戒提示"/>
              <LineChart/>
            </IceContainer>
            <IceContainer>
              <div style={{height: '1100px', marginBottom: '20px'}} id="iframeCont">
                <iframe style={{width:'100%', height: '100%'}} frameBorder="0" src={frameURL}></iframe>
              </div>
            </IceContainer>
          </Col>
          <Col span="8" style={{paddingRight: '16px'}}>
            <IceContainer style={{ marginBottom: '15px', borderRadius: '0', padding: '0' }}>
              <Tab type="bar">
                <TabPane  className="risk-tab" key="市值异动提示" tab="市值异动提示">
                  <AbnormalTable/>
                </TabPane>
                <TabPane  className="risk-tab" key="举牌风险预警" tab="举牌风险预警">
                  <BoardRiskTable/>
                </TabPane>
              </Tab>
            </IceContainer>
          </Col>
          <Col span="8">
            <IceContainer style={{ marginBottom: '15px', borderRadius: '0', padding: '0' }}>
              <TitleBox title="第一股东股权质押风险提示"/>
              <FirstStockholder/>
            </IceContainer>
          </Col>
        </Row>
      </div>
    )
  }
}